<template>
	<page-meta><navigation-bar :title="title" front-color="#000000" background-color="#ffffff" /></page-meta>
	<view>
		<view class="list" style="padding: 0 15px;">
			<view class="lst-item border-bt" style="padding: 15px 0;overflow: hidden;" v-for="i,index in list">
				<image  @tap="$go('/pages/echart/echart?obj='+JSON.stringify(i))" :src="i.headPortrait" style="width: 60px;float: left; height: 60px;border: 1px solid #acacac;margin-top: 6px;" mode=""></image>
				<view  @tap="$go('/pages/echart/echart?obj='+JSON.stringify(i))" class="lst-cen" style="float: left;font-size: 13px;margin-left: 10px;">
					<view class="" style="font-size: 16px;padding-bottom: 6px;font-weight: 650;">
						{{i.traderName}}
						
					</view>
					<view style="font-size: 13px;padding-bottom: 2px;">
						<text style="color: #acacac;display: inline-block;">跟随人数 <span style="color: #000000;padding-left: 5px;">{{i.followTotalNum}}</span></text>
					</view>
					<view class="" style="color: #acacac;padding-bottom: 2px;">
						适应金额
						<text style="color: #000000;padding-left: 5px;">{{i.maxPosMargin}}</text>
					</view>
					<view class="" style="color: #acacac;padding-bottom: 2px;">
						品种
						<text style="color: #000000;padding-left: 5px;">{{i.commodityNo?i.commodityNo:'--'}}</text>
					</view>
					<view style="color: #acacac;padding-bottom: 2px;">
						每日限仓手数
						<text style="color: #000000;padding-left: 5px;">{{i.limitDayOrders?i.limitDayOrders+'手':'不限'}}</text>
					</view>
					<!-- <view style="color: #acacac;padding-bottom: 2px;background: #f1f1f1;padding: 2px 5px;clear: both;float: left;margin-bottom: 3px;margin-top: 5px;">
						当前合约
						<text style="color: #000000;padding-left: 5px;">{{i.limitDayOrders?i.limitDayOrders+'手':'不限'}}</text>
					</view>
					<view style="color: #acacac;padding-bottom: 2px;background: #f1f1f1; clear: both;float: left;padding: 2px 5px;">
						当前盈亏
						<text style="color: #000000;padding-left: 5px;">{{i.limitDayOrders?i.limitDayOrders+'手':'不限'}}</text>
					</view> -->
				</view>
				<view class="lst-rig" style="float: right;text-align: right;">
					<span v-if="i.myFocusState==0" @tap="quxiao(i,1)" style="border: 1px solid #000;border-radius: 50%;margin-right: 3px; float: right;clear: both;margin-bottom: 2px; display: block;width: 30rpx;height: 30rpx;line-height: 30rpx;text-align: center;">+</span>
					<span v-else @tap="quxiao(i,0)" style="border: 1px solid #000;border-radius: 50%;margin-right: 3px; float: right;clear: both;margin-bottom: 2px; display: block;width: 30rpx;height: 30rpx;line-height: 30rpx;text-align: center;">-</span>
					<span style="display: block;clear: both;font-size: 12px;color: #acacac;">自选</span>
					
					<view style="overflow: hidden;clear: both;margin-top:32rpx;">
						<text style="display: block;float: right;clear: both;font-size: 14px;color: red;max-width: 200rpx;overflow: hidden;text-overflow: ellipsis;" :style="{color:i.profit>0?'red':'green'}">
						<!-- {{i.currencyCode}} -->
						
						<text style="color: #000;">{{i.currencySymbol}}</text>{{i.profit.toFixed(0)}}</text>
						<text style="display: block;float: right;clear: both;font-size: 14px;margin-top: 10rpx;">账户盈亏</text>
						
						<view class="" style="text-align: center;">
							<span v-if="i.dealerFollowState == 0" @tap="$go('/pages/echart/gensui?obj='+JSON.stringify(i),true)" style="display:block;margin-top: 32rpx; clear: both;font-size: 12px;padding: 2px 10px;background: #168deb;overflow: hidden;float: right;color: #fff;border-radius: 2px;">订阅</span>
							<span v-else @tap="$go('/pages/center/detail?uid='+i.traderUid)" style="display:block;margin-top: 32rpx; clear: both;font-size: 12px;padding: 2px 10px;background: #168deb;overflow: hidden;float: right;color: #fff;border-radius: 2px;">取消订阅</span>
							<text style="color: #ea7b4e;display: block;clear: both;font-size: 12px;text-align: right;padding-top: 10rpx;">{{i.subPoint}}积分/手</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<uni-text v-if="!list.length && load" style="height: 400x;font-size: 16px;text-align: center;display: block;color: red;padding-top: 150px;">
			暂无{{title}}信息！
		</uni-text>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'',
				point:0,
				list:[],
				load:false
			}
		},
		methods: {
			quxiao(obj,id){
				if(!this.$store.state.user){
					uni.showToast({
						title: '请登录后重试！',
						icon: 'none',
						duration: 1500
						// position:'top'
					});
					return;
				}
					  var _this= this;
					  uni.request({
					  	url: _this.$store.state.url + '/api/shequuser/mycenter/addoreidtmyfocus?ftoken='+_this.$store.state.user.token+'&ftraderuid='+obj.traderUid+'&ftraderacc='+obj.traderName+'&fstate='+id,
					  	method: 'POST',
					  	// data: _this.param,
					  	
					  	success: res => {
					  		res = res.data;
					  		if (res.code == 200) {
					  			if(id == 1){
					  				uni.showToast({
					  					title: '已关注！',
					  					duration:2000
					  				});
									obj.myFocusState = 1;
					  			}else{
									obj.myFocusState = 0;
					  			}
					  			// _this.$store.commit('getcollection');
					  		} else {
					  		}
					  	},
					  	fail: res => {
					  		console.log(res);
					  	}
					  });
			},
			getdata(){
				var _this = this;
				uni.request({
					method: 'get',
					url:_this.$store.state.user?_this.$store.state.url1 + '/api/GWDataShow/GetSheQuShareTraderListWitnPoint?point='+_this.point+'&token=' + _this.$store.state.user.token : _this.$store.state.url1+'/api/GWDataShow/GetSheQuShareTraderListWitnPoint?point='+_this.point,
					// contentType: "application/json;",
					// data:json,
					// data: json,
					success: function(data) {
						// console.log(data,'交易此仓列表',json)
						_this.load = true;
						data = data.data;
						// console.log(data)
						if (data.code == 200) {
							_this.list = data.data;
							// console.log(_this.list)
						} else {
						}
					}
				});
			}
		},
		onShow() {
			var _this = this;
			uni.getNetworkType({
				success: function(res) {
					if (res.networkType == 'none') {
						uni.showToast({
							title: '当前无网络连接，请检查！',
							icon: 'none',
							duration: 5000
			
							// position:'top'
						});
					}
				}
			});
			uni.onNetworkStatusChange(function(res) {
				if (!res.isConnected) {
					uni.showToast({
						title: '当前无网络连接，请检查！',
						icon: 'none',
						duration: 3000
						// position:'top'
					});
				} else {
					uni.showToast({
						title: '网络已连接！',
						icon: 'none',
						duration: 3000
						// position:'top'
					});
					_this.getdata();
				}
			});
			_this.getdata();
		},
		onLoad(e) {
			this.title = e.title;
			this.point = e.point;
		}
	}
</script>

<style>

</style>
